import React, { useState } from 'react'

export default function App() {
    const [text, settext] = useState(null)
    const [list, setlist] = useState([111,222,333])
    const handleDel = (index)=>{
        var newlist = [...list];
        newlist.splice(index, 1)
        setlist(newlist);
    }
    return (
    <div>
        <input placeholder='请随便输入' onChange={(evt)=>{
            settext(evt.target.value);
            // console.log(text)
        }}></input>
        <button onClick={()=>{
            setlist([...list, text])
            settext('')
        }}>click</button>
        <ul>
            {
                list.map((item, index) =>
                    <li key={item}>{item}
                        <button onClick={()=>{
                            handleDel(index);
                        }}>Del</button>
                    </li>
                )
            }
        </ul>
        {!list.length&& <span>空空如也</span>}
    </div>
  )
}
